* {
	margin: 0px;
	padding: 0px;
	list-style-type: none;
	font-family: "微软雅黑";
}

#main {
	/*background-image: url(img/bgimg.png);
				background-size: 100%;*/
	/*width: 1366px;
				height: 662px;*/
}

body {
	/*background-image: url(img/bgimg.png);*/
	background-image: url(../img/beijing.jpg);
}

#chat {
	background-color: white;
	/*height: 662px;*/
	overflow: hidden;
	width: 1000px;
	margin: auto;
	position: relative;
}

#left,
#right {
	float: left;
}

#left {
	background-color: #2E3238;
	width: 280px;
	height: 100%;
}

#left_1 {
	height: 76px;
	width: 250px;
	margin: auto;
}

#left_1_bigImg {
	position: absolute;
	display: none;
	border-radius: 3px;
	left: 60px;
	top: 60px;
	z-index: 100;
}

#left_1 #touxiang {
	cursor: pointer;
	width: 40px;
	height: 40px;
	margin-top: 18px;
	margin-left: 3px;
	border-radius: 2px;
}

#left_1 span {
	margin-left: 10px;
	position: relative;
	top: -15px;
	color: white;
	font-size: 18px;
}

#left_1 .caidan1 {
	margin-bottom: 10px;
}

#left_1 .caidan2 {
	margin-bottom: 15px;
}

#left_2 {
	height: 32px;
	width: 247px;
	margin: auto;
	background-color: #26292E;
}

#left_2>img {
	padding: 4px 5px;
}

#left_2>input {
	/*border: 1px solid;*/
	width: 80%;
	position: relative;
	top: -12px;
	border: 0px;
	outline: none;
	color: #A4A4A4;
	font-size: 12px;
	background-color: #26292E;
}

#left_3 {
	border-bottom: #24272C;
	position: relative;
}

#left_3 img {
	cursor: pointer;
	padding: 5px 29.5px;
}

#left_4 {
	height: 100px;
	overflow: auto;
	height: 503px;
}

#left_4 ul {
	border: 1px solid #24272C;
	background-color: #292D32;
	display: none;
}

#left_4 ul li {
	background-color: #2F3239;
}

#left_4 .even img {
	width: 20px;
	margin: 10px 0px;
	margin-left: 20px;
	margin-right: 10px;
	border-radius: 15px;
}

#left_4 .even span {
	font-size: 12px;
	position: relative;
	top: -15px;
	color: #7E7E7F;
}

#left_4 .odd {
	width: 100%;
	height: 60px;
}

#left_4 .odd span {
	width: 180px;
	float: left;
	font-size: 12px;
	margin: 10px 15px;
	color: white;
}

#left_4 .odd img {
	margin-top: 10px;
}

::-webkit-scrollbar {
	width: 10px;
}

::-webkit-scrollbar-thumb {
	background-color: #595B60;
}

#left_4 table {
	width: 100%;
}

#left_4 table td {
	cursor: pointer;
	border-top: 1px solid #292C33;
	height: 65px;
	width: 270px;
}

#left_4 table .tab_TX1 .grayqian img {
	width: 40px;
	height: 40px;
	margin-left: 20px;
	border-radius: 3px;
}

#left_4 table span {
	position: relative;
	top: -28px;
	left: 3px;
	color: white;
	font-size: 12px;
}

#left_4 #left_4_div {
	background-color: #292D32;
	display: none;
}

#left_4 #left_4_div div {
	cursor: pointer;
	background-color: #2E3238;
	margin-bottom: 1px;
	font-size: 14px;
	color: white;
}

#left_4 #left_4_div img {
	width: 30px;
	height: 30px;
	margin: 10px 0px;
	margin-left: 20px;
	margin-right: 10px;
	border-radius: 3px;
	vertical-align: middle;
}

#left_4 #left_4_div p {
	width: 100%;
	padding: 2px 20px;
	color: #787B87;
	font-size: 14px;
}

#right {
	background-color: #EEEEEE;
	width: 718px;
	height: 100%;
	/*display: none;*/
}

#right_1 {
	height: 50px;
}

#right_1>span {
	cursor: pointer;
	position: relative;
	left: 45%;
	line-height: 50px;
	font-size: 13px;
}

#right_2 {
	border-top: 1px solid #D6D6D6;
	margin: auto;
	width: 682px;
	height: 477px;
	overflow: auto;
}

#right_2 #content span {
	max-width: 300px;
	word-break: break-all;
}

#right_2 #content li {
	list-style-type: none;
	margin-top: 10px;
	overflow: hidden;
}

#right_2 #content #time {
	font-size: 12px;
	background-color: #DCDCDC;
	margin: auto;
	margin-top: 10px;
	color: white;
	width: 80px;
	padding: 3px 10px;
	border-radius: 3px;
}

#right_2 #content #content_img {
	float: right;
	width: 40px;
	height: 40px;
	border-radius: 3px;
	margin-left: 10px;
}

#right_2 #content li #txt {
	float: right;
	background-color: #B2E281;
	padding: 10px 20px;
	font-size: 14px;
	border-radius: 3px;
}

#right_2 #xialatu {
	width: 682px;
	height: 116px;
	background-image: url(../img/下拉图.png);
	display: none;
	position: absolute;
}

#right_2 #xialatu #xialatu_img {
	/*height: 40px;
	width: 40px;*/
	font-size: 8px;
	float: left;
	position: relative;
	left: 100px;
	top: 30px;
}
#right_2 #xialatu #xialatu_img span{
	position: relative;
	top: 10px;
	margin-left: 10px;
}

#right_2 #xialatu #xialatu_img img {
	border-radius:3px ;
	width: 40px;
	height: 40px;
	float: left;
	margin-right: 5px;
}

#xialatu #xialatu_btn {
	position: absolute;
	cursor: pointer;
	outline: none;
	width: 55px;
	border: none;
	background: none;
	height: 55px;
	left: 24px;
	top: 20px;
}

#right_3 {
	border-top: 1px solid #D6D6D6;
	width: 700px;
	height: 40px;
}

#right_B_2 {
	overflow: hidden;
	overflow: auto;
}

#right_B {
	display: none;
}

#right_B #right_B_1 {
	height: 50px;
	line-height: 50px;
	text-align: center;
	font-size: 14px;
	background-color: #EEEEEE;
	border-bottom: 1px solid #D6D6D6;
}

#right_B_2 img {
	width: 677px;
	margin-left: 20px;
}

#right_C {
	background-color: #EEEEEE;
	display: none;
}

#right_C_2>div img {
	width: 100px;
	position: relative;
	top: 80px;
	left: 310px;
}

#right_C_2>p {
	cursor: pointer;
	border-radius: 5px;
	position: relative;
	background-color: #42AC3E;
	left: 260px;
	top: 150px;
	width: 200px;
	height: 43px;
	overflow: auto;
	text-align: center;
	line-height: 42px;
	color: white;
	font-size: 14px;
}

#right_C #right_C_1 {
	height: 50px;
	line-height: 50px;
	text-align: center;
	font-size: 14px;
	border-bottom: 1px solid #D6D6D6;
	background-color: #EEEEEE;
}

#right_4 {
	/*height: 85px;*/
	width: 682px;
	margin: auto;
}

#right_5 {
	/*border: 1px solid;*/
	width: 682px;
	margin: auto;
	height: 50px;
	line-height: 40px;
}

#right_5 .right_5_txt {
	margin-left: 470px;
	color: #888888;
	font-size: 12px;
}

#right_5 .right_5_set {
	cursor: pointer;
	border: 1px solid #C1C1C1;
	border-radius: 3px;
	padding: 5px 30px;
	font-size: 14px;
	color: #474747;
	margin-left: 15px;
	background-color: white;
}

textarea {
	width: 100%;
	height: 100%;
	resize: none;
	outline: none;
	border: 0px;
	background-color: #EEEEEE;
}

.tab_TX1 .graysheng,
.tab_TX2 .graysheng {
	background-color: #2E3238;
}

.graysheng {
	background-color: #2E3238;
}

.tab_TX1 .graysheng>img,
.grayqian>img {
	width: 40px;
	margin-left: 20px;
	border-radius: 3px;
}

.tab_TX1 .grayqian,
.tab_TX2 .grayqian {
	background-color: #3A3F45;
}

#face_div {
	border: 1px solid #DEDEDE;
	width: 475px;
	height: 270px;
	position: absolute;
	top: 255px;
	display: none;
}

#face_div .face_div1 {
	height: 40px;
}

#face_div .face_div1 .QQface {
	background-color: white;
	height: 32px;
	width: 90px;
	position: relative;
	left: 20px;
	top: 10px;
}

#face {
	cursor: pointer;
}

#face_div .face_div1 .QQface span {
	font-size: 14px;
	color: #404040;
	position: relative;
	left: 20px;
	top: 5px;
}

#face_div .face_div2 {
	height: 233px;
	background-position: center center;
	background-repeat: no-repeat;
	background-size: 434px;
	/*background-image: url(img/qqfacePanel31e225.png);*/
	background-color: white;
}

#face_tab {
	width: 435px;
	height: 205px;
	position: relative;
	top: 14px;
	left: 23px;
}

#face_tab td {
	height: 25px;
	cursor: pointer;
}

#sousuo {
	position: absolute;
	background-color: #393C43;
	width: 245px;
	top: 5px;
	left: 18px;
	display: none;
	z-index: 100;
}

#sousuo .sousuo_first {
	color: #757884;
	padding: 5px 15px;
	border-bottom: 1px solid #33363B;
}

#sousuo_content .sousuo_li {
	border-bottom: 1px solid #33363B;
	font-size: 14px;
	color: white;
}

#sousuo_content .sousuo_li:hover {
	background-color: #595B64;
	cursor: pointer;
}

#sousuo_content .sousuo_li img {
	width: 30px;
	padding: 8px 15px;
	vertical-align: middle;
}

#left_1_bigImg_btn {
	cursor: pointer;
	position: absolute;
	left: 178px;
	top: 245px;
	width: 20px;
	height: 20px;
	/*background: none;*/
	border: none;
	outline: none;
}

#tjqunliao {
	position: absolute;
	height: 600px;
	width: 480px;
	left: 260px;
	top: 10px;
	background-color: white;
	border-radius: 5px;
	z-index: 200;
	display: none;
}

#tjqunliao_1 {
	height: 90px;
	background-color: #F9F9F9;
	border-bottom: 1px solid #E5E5E5;
}

#tjqunliao_2 {
	height: 60px;
	overflow: auto;
	background-color: white;
}

#tjqunliao_2>img {
	margin-top: 18px;
	margin-right: 10px;
	margin-left: 10px;
	vertical-align: middle;
}

#tjqunliao_2>input {
	border: 0px;
	outline: none;
	position: relative;
	top: 10px;
}

#tjqunliao_2 div img {
	width: 40px;
	height: 40px;
	float: left;
	margin: 10px 0px;
	margin-left: 17px;
}

#tjqunliao_2 div span {
	display: none;
}

#tjqunliao_3 {
	width: 440px;
	height: 370px;
	margin: auto;
	overflow: auto;
}

#tjqunliao_3 li {
	cursor: pointer;
	border-bottom: 1px solid #F2F2F2;
	height: 55px;
}

#tjqunliao_3 li img {
	border-radius: 3px;
	width: 40px;
	height: 40px;
	vertical-align: middle;
	margin: 7px 10px;
	margin-left: 50px;
}

.myliaotian,
.left-right_C>img {
	border-radius: 3px;
	width: 40px;
	margin-left: 20px;
}

.none {
	display: none;
}

.left4-qunliao1>img,
.left4-qunliao2>img {
	width: 40px;
	margin-left: 20px;
}

.left4-qunliao {
	background-color: #DDDEE0;
	width: 40px;
	height: 40px;
	border-radius: 3px;
	margin-left: 20px;
}
.left4-qunliao img{
	float: left;
}
.left4-qunliao3>div img,
.L3 img,
.tab_TX1 .grayqian .left4-qunliao img,
.tab_TX1 .graysheng>div img {
	width: 15px;
	margin-bottom: 1px;
	margin-left: 3.5px;
}

.L3 {
	background-color: #3A3F45;
	width: 15px;
	margin-bottom: 1px;
	margin-left: 3.5px;
}

.left4-qunliao3>div img:first-of-type,
.L3 img:first-of-type,
.tab_TX1 .grayqian>div img:first-of-type,
.tab_TX1 .graysheng>div img:first-of-type {
	width: 15px;
	margin-left: 12px;
}

.left4-qunliao4>div img {
	width: 20px;
}

.tab_TX2 .left4-qunliao4 div img,
.tab_TX2 .grayqian>div img,
.tab_TX2 .graysheng>div img {
	width: 20px;
	border-radius: 3px;
}


/*接入图灵机器人CSS样式开始*/

#right_2 #content span {
	max-width: 300px;
	word-break: break-all;
}

#right_2 #content li {
	list-style-type: none;
	margin-top: 10px;
	overflow: hidden;
}

#right_2 #content .tulin_img {
	float: left;
	width: 40px;
	height: 40px;
	border-radius: 3px;
	margin-right: 10px;
}

#right_2 #content li .tulin_txt {
	float: left;
	background-color: white;
	padding: 10px 20px;
	font-size: 14px;
	border-radius: 3px;
}
/*接入图灵机器人CSS样式结束*/
/*聊天对话框小尖角样式开始*/
.content_left .xiaojianjiao_left {
	float: left;
	margin-top: 10px;
	border: solid 9px;
	border-color: #EEEEEE white #EEEEEE #EEEEEE;
}
.content_right .xiaojianjiao_right {
	float: right;
	margin-top: 10px;
	border: solid 9px;
	border-color: #EEEEEE #EEEEEE #EEEEEE #B2E281;
}
/*聊天对话框小尖角样式结束*/